<template>
    <div class="main">
      <!-- <index-chart v-if="indexStyle==1"></index-chart>
      <index-bdc v-if="indexStyle==2"></index-bdc>
      <index-task v-if="indexStyle==3"></index-task>
      <div style="width: 100%;text-align: right;margin-top: 20px">
        请选择首页样式：
        <a-radio-group v-model="indexStyle">
          <a-radio :value="1">统计图表</a-radio>
          <a-radio :value="2">统计图表2</a-radio>
          <a-radio :value="3">任务表格</a-radio>
        </a-radio-group>
      </div> -->
      
      <div class="home" v-if="hasHomepage">
        <div class="tipBox">
          <img src="~@/assets/homePreview.png" alt="文件">
          <p>还未设置首页，请前往<span>【管理中心】-【仪表板】</span>设置首页~</p>
        </div>
      </div>
      <div class="homepage" v-else>
          <NewMeter :homepageId="homepageId" :homepageCode="code" :homepageGrade="grade"></NewMeter>
      </div>

    </div>
</template>

<script>

import IndexChart from './IndexChart'
import IndexTask from "./IndexTask"
import IndexBdc from './IndexBdc'
import { getHomepage } from '@/api/api'
import NewMeter from '../meter/NewMeter'

export default {
    name: "Analysis",
    components: {
        IndexChart,
        IndexTask,
        IndexBdc,
        NewMeter,
    },
    data() {
        return {
            indexStyle: 1,
            hasHomepage: true,
            data: [],
            homepageId: '',
            code: '',
            grade: '',
        }
    },
    created() {
        this.getHomepage()
    },
    methods: {
        // 获取文件夹仪表板层级
        getHomepage(){
            let params = {
                
            }
            getHomepage(params).then((res)=>{
                if(res.success && res.result){
                    this.hasHomepage = false
                    this.data = res.result
                    this.homepageId = res.result.id
                    this.code = res.result.code
                    this.grade = res.result.grade
                }else{
                    this.hasHomepage = true
                }
            })
        },
    }
  }
</script>

<style lang="less" scoped>
.main{
    width: 100%;
    height: 100%;
    .home{
        width: 100%;
        min-height: 760px;
        background: #ffffff;
        display: flex;
        justify-content: center;
        align-items: center;
        .tipBox{
            width: 400px;
            height: 100px;
            text-align: center;
            img{
            width: 60px;
            }
            p{
            margin-top: 10px;
            color: #9f9f9f;
            span{
                font-weight: bold;
            }
            }
        }
    }
    .homepage{
        width: 100%;
        height: 100%;
        margin-top: 10px;
        background: #ffffff;
        display: flex;
        justify-content: center;
    }
}
</style>
